<template>
    <div class="page-container">
        <h-table
                :list="list"
                :total="total"
                :options="options"
                :operates="operates"
                :columns="setting.columns"
                @pagination="getDataInfo"
                @handleSelectionChange="handleSelectionChange"
        />
        <pagination
                v-show="total > 0"
                :total="total"
                v-model:page="queryParams.pageNum"
                v-model:limit="queryParams.pageSize"
                @pagination="getDataInfo"
        />
    </div>
</template>

<script setup name="tablePage">
import setting from './setting'

const { proxy } = getCurrentInstance()
const router = useRouter()

/** data*/
const list = ref([]);
const total = ref(0);

const options = reactive({// table 配置的参数
    stripe: true,
    loading: false,
    highlightCurrentRow: true,
    mutiSelect: true
})
const operates = reactive({// table 配置的参数
    width: 180,
    fixed: "right",
    label: "操作",
    list: [
        {
            id: "mdf", label: "修改", type: "primary", plain:true, show: true, disabled: false,
            method: (index, row) => {}
        },
        {
            id: "ddd", label: "删除", type: "danger", plain:true, show: true, disabled: false,
            method: (index, row) => {}
        }
    ]
})

const queryParams = reactive({
    pageNum: 1,
    pageSize: 10
});

// const data = reactive({
//     queryParams: {
//         pageNum: 1,
//         pageSize: 10,
//     },
// });
// const { queryParams } = toRefs(data);

/** */
const getDataInfo = async () => {
    let _ = proxy
    console.log('queryParams',queryParams)
    options.loading = true
    const {data: res} = await _.$H.post(_.$A.tableList, queryParams)
    list.value = res.data.list
    total.value = res.data.total
    options.loading = false
    console.log('handleLogin',list.value)

}
const handleSelectionChange = (val) => {
    console.log('handleSelectionChange',val)
}
getDataInfo()
</script>

<style lang="less" scoped>

</style>
